<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>确认订单</title>
  <link th:href="@{/css/index.css}" rel="stylesheet">
  <link th:href="@{/css/order.css}" rel="stylesheet">
</head>
<body>
<th:block th:insert="~{header :: head}"/>

<div class="container">
  <h1>确认订单</h1>

  <!-- 演唱会信息 -->
  <div class="concert-details">
    <div class="concert-image">
      <img th:src="${concert.concertImg}" alt="Concert Poster">
    </div>
    <div class="details">
      <h2 th:text="${concert.concertname}"></h2>
      <p><strong>时间：</strong><span th:text="${#dates.format(concert.concertdate, 'yyyy.MM.dd')} + ' ' + ${#dates.format(concert.concerttime, 'HH:mm')}"></span></p>
      <p><strong>地点：</strong><span th:text="${concert.venue}"></span></p>
      <p><strong>票档：</strong><span th:text="${ticket.getTickettype()}"></span></p>
      <p><strong>合计金额：</strong>￥<span th:text="${ticket.getPrice()}"></span></p>
    </div>
  </div>

  <!-- 用户填写信息 -->
  <div class="user-info">
    <h3>确认购票人信息</h3>
    <form th:action="@{/createOrder}" method="post">
      <input type="hidden" name="concertid" th:value="${concert.concertid}">
      <input type="hidden" name="ticketid" th:value="${ticket.getTicketid()}">
      <input type="hidden" name="orderid" value="0">

      <label for="username">姓名：</label>
      <input type="text" id="username" name="username" th:value="${session.user.getRealname()}" required>

      <label for="phone">联系电话：</label>
      <input type="tel" id="phone" name="phone" th:value="${session.user.getPhonenumber()}" required>

      <label for="email">电子邮件：</label>
      <input type="email" id="email" name="email" th:value="${session.user.getEmail()}">

      <!-- 支付方式 -->
      <h3>选择支付方式</h3>
      <label>
        <input type="radio" name="payment" value="支付宝" required>
        支付宝
      </label>
      <label>
        <input type="radio" name="payment" value="微信支付" required>
        微信支付
      </label>
      <label>
        <input type="radio" name="payment" value="银行卡支付" required>
        银行卡支付
      </label>
      <!-- 提交订单按钮 -->
      <div class="submit-order">
        <button type="submit" class="confirm-button">确认订单并支付</button>
      </div>
    </form>
  </div>
</div>

<th:block th:insert="~{footer :: foot}"/>
</body>
</html>
